<template>
  <div>
    <Row>
      <Col span="24">
        <div style="margin:10px 15px;">
          <Card>
            <div style="display: flex;flex:1;">
              <div style="flex:1;display: flex;align-items: center;justify-content: center;">
                  <Icon color="green" size="36" type="ios-checkmark-circle-outline" />
                  <div>
                    <p style="font-size:16px;color:green;text-align: center;"><span v-text="validatorSuccessNum"></span>条</p>
                    <p style="font-size:16px;color:green;text-align: center;">成功检测</p>
                  </div>
              </div>
              <div style="flex:1;display: flex;align-items: center;justify-content: center;">
                  <Icon color="red" size="36" type="ios-close-circle-outline" />
                  <div>
                    <p style="font-size:16px;color:red;text-align: center;"><span v-text="validatorErrorNum"></span>条</p>
                    <p style="font-size:16px;color:red;text-align: center;">检测失败</p>
                  </div>
              </div>
            </div>
          </Card>
        </div>
      </Col>
    </Row>
    <Row>
      <Col span="24">
        <div style="margin:10px 15px;">
          <Tabs
            :validatorErrorStudent="validatorErrorStudent"
            :validatorErrorTeacher="validatorErrorTeacher"
            :validatorErrorGroup="validatorErrorGroup"
            :validatorErrorClassRoom="validatorErrorClassRoom"
            :validatorErrorStudentGroup="validatorErrorStudentGroup"
            ref="tabs" />
        </div>
      </Col>
    </Row>
    <Row>
      <Col span="12" style="padding-left:15px;">
        <Button @click="$emit('previous')">重新导入</Button>
      </Col>
      <Col span="12" style="text-align:right;padding-right:15px;">
        <Button @click="$emit('start-import-data')" type="primary">开始导入</Button>
      </Col>
    </Row>
  </div>
</template>
<script>
import Tabs from './two-tabs/main'
export default {
  name: 'two',
  props: {
    validatorSuccessNum: {
      type: Number,
      default: 0
    },
    validatorErrorNum: {
      type: Number,
      default: 0
    },
    validatorErrorStudent: {
      type: Number,
      default: 0
    },
    validatorErrorTeacher: {
      type: Number,
      default: 0
    },
    validatorErrorGroup: {
      type: Number,
      default: 0
    },
    validatorErrorClassRoom: {
      type: Number,
      default: 0
    },
    validatorErrorStudentGroup: {
      type: Number,
      default: 0
    },
    jobID: {
      type: String,
      default: ''
    }
  },
  components: {
    Tabs
  },
  methods: {
    reload (jobID) {
      this.$refs['tabs'].reload(jobID)
    },
    previous () {
      this.$emit('previous')
    }
  }
}
</script>
